<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">
    <title>{$all['title']}</title>
    <link rel="stylesheet" href="/build/css/pcView.css">
    <script src="http://g.alicdn.com/de/prismplayer/1.5.2/prism-flash-min.js"></script>
    <script src="//cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
    <script src="/build/js/aleart.js" type="text/javascript"></script>
    <!--[if lte IE 7]>
    <script src="/js/json2.js"></script>
    <![endif]-->
    <!--[if lte IE 6]>
    <script src="/build/js/ie6fix.js"></script>
    <![endif]-->
    <style>.showpic{overflow: hidden;height: 480px;position: relative;}.showpic img{position: absolute;top:50%;left:0;margin-top: -240px;}
    .whtv-content .whtv-player .player{height: 480px;}
    </style>
</head>
<body>
    <div class="whtv-content">
        <div class="header">
            {$all['title']}
        </div>
        <div class="danCtrl"></div>
        <div class="whtv-player">
            <div class="player" <?php if(count($info)<=1){ ?> style="width:100%"<?php } ?>>
                <div id="J_prismPlayer" class="prism-player"></div>
            </div>

			<?php if(count($info)>1){ ?>
            <div class="menu">
                <ul>
                    <volist name="info" id="vo" key="k">
                   <li  class="videoCtrl <eq name='k' value='1'> active</eq>"><a href="javascript:;"  data-stream="{$vo['group_id']}_{$vo['user_id']}"  data-id="{$vo['id']}"><span class="noter"></span><?php if($vo['pos_name']){echo $vo['pos_name'];}else{echo $k.'号机位';} ?></a></li>
                    </volist>
                </ul>
            </div>
        <?php } ?>
        </div>
    </div>
    <div class="face-wrap" style="display:none">
    <!--<div class="face-arrow-up"></div>-->
    <ul class="face-list">
        <li class="face-list-item" data-code="[/流汗]">
            <span class="face-item face09"></span>
        </li>
        <li class="face-list-item" data-code="[/大哭]">
            <span class="face-item face13"></span>
        </li>
        <li class="face-list-item" data-code="[/发怒]">
            <span class="face-item face03"></span>
        </li>
        <li class="face-list-item" data-code="[/鼓掌]">
            <span class="face-item face02"></span>
        </li>
        <li class="face-list-item" data-code="[/给力]">
            <span class="face-item face05"></span>
        </li>
        <li class="face-list-item" data-code="[/闭嘴]">
            <span class="face-item face17"></span>
        </li>
        <li class="face-list-item" data-code="[/憨笑]">
            <span class="face-item face06"></span>
        </li>
        <li class="face-list-item" data-code="[/色]">
            <span class="face-item face04"></span>
        </li>
        <li class="face-list-item" data-code="[/强]">
            <span class="face-item face10"></span>
        </li>
        <li class="face-list-item" data-code="[/弱]">
            <span class="face-item face11"></span>
        </li>
        <li class="face-list-item" data-code="[/鄙视]">
            <span class="face-item face15"></span>
        </li>
        <li class="face-list-item" data-code="[/可爱]">
            <span class="face-item face07"></span>
        </li>
        <li class="face-list-item" data-code="[/惊讶]">
            <span class="face-item face19"></span>
        </li>
        <li class="face-list-item" data-code="[/疑问]">
            <span class="face-item face14"></span>
        </li>
        <li class="face-list-item" data-code="[/抓狂]">
            <span class="face-item face08"></span>
        </li>
        <li class="face-list-item" data-code="[/浮云]">
            <span class="face-item face20"></span>
        </li>
        <li class="face-list-item" data-code="[/可怜]">
            <span class="face-item face18"></span>
        </li>
        <li class="face-list-item" data-code="[/玫瑰]">
            <span class="face-item face12"></span>
        </li>
        <li class="face-list-item" data-code="[/钱]">
            <span class="face-item face16"></span>
        </li>
        <li class="face-list-item" data-code="[/握手]">
            <span class="face-item face22"></span>
        </li>
        <li class="face-list-item" data-code="[/拳头]">
            <span class="face-item face23"></span>
        </li>
        <li class="face-list-item" data-code="[/酒]">
            <span class="face-item face24"></span>
        </li>
        <li class="face-list-item" data-code="[/奋斗]">
            <span class="face-item face01"></span>
        </li>
        <li class="face-list-item" data-code="[/打酱油]">
            <span class="face-item face21"></span>
        </li>
    </ul>

    <script src="/common/getClientInfo.php?source=PC"></script>

    <script>
        var group_id = '{$all["group_id"]}';

        $(function(){
            $(".menu a").click(function(){
                $(this).parent().addClass("active").siblings().removeClass("active");
            });
            // $.confirm('<input id="test" type="text">',function(){console.log($("#test").val());},function(){console.log($("#test").val())});
        });
        
		var player;
        
        $(window).load(function(){
            $.ajax({
                async: false,
                url: "/common/pcstream.php?stream={$all['group_id']}_{$all['user_id']}&id={$all['id']}",
                success: function(data){
                    data = $.parseJSON(data);
                    if(data['status'] == 0) {
                        var image = data['image_url']!="/Uploads/" ? data['image_url'] : '/img/default.jpg';
                        $('#J_prismPlayer').html('<div class="showpic"><img src="' + image + '" width="100%" alt="" /></div>'); 
                    } else {
                        myplayer(data['url']);
                    }
                }
            });
        })


        function myplayer(url){
            $("#J_prismPlayer").empty();
            player = new prismplayer({
                id: "J_prismPlayer", // 容器id
                source: url,// 视频地址
                autoplay: true,    //自动播放：否
                width: "100%",       // 播放器宽度
                <?php if($all['group_status'] != 3) { ?>
                    isLive:true,
                <?php } ?>

                height: '480px',      // 播放器高度
                extraInfo:{ "fullTitle":"{$info[0]['title']}-见微"}
            });
        }


        $(".videoCtrl a").on("click",function(){
            var item=$(this);
            if(!item.parent().hasClass("active")){
                $.ajax({
                    async: false,
                    url: "/common/pcstream.php?stream="+$(this).data('stream')+"&id="+$(this).data('id'),
                    success: function(data){
                        data = $.parseJSON(data);
                        if(data['status'] == 0) {
                            var image = data['image_url']!="/Uploads/" ? data['image_url'] : '/img/default.jpg';
                            $('#J_prismPlayer').html('<div class="showpic"><img src="' + image + '" width="100%" alt="" /></div>'); 
                        } else {
                            myplayer(data['url']);
                            //player.loadByUrl(data['url']);
                            item.parent("li").addClass('active').siblings('.active').removeClass('active');            
                        }
                    }
                });
            }
        })


        $.post("/common/wRecord.php?group_id={$all['group_id']}", {ip:ip, client_type:client_type, source:source}, function (data) {
            
        })


    </script>
    <script src="/js/danmu.js"></script>
</body>
</html>